﻿function Scene(canvasId) {
    this.canvasId = canvasId;
    
    this.canvas = document.getElementById(canvasId);
    this.ctx = this.canvas.getContext("2d");

    this.areas = [];

    this.add = function (area) {
        this.areas.push(area);
    }
    this.refresh = function () {
        this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.width);
        for (var i = 0; i < this.areas.length; i++) {
            this.areas[i].draw(this.ctx);
        }
    }
    this.getAreaAtPosition = function(point){
        for (var i = 0; i < this.areas.length; i++) {
            if (this.areas[i].isPointInArea(this.ctx, point))
                return this.areas[i];
        }
        return null;
    }
}

function Area(name) {
    this.name = name;
    this.curves = [];

    this.add = function (curve) {
        this.curves.push(curve);
    }

    this.isPointInArea = function (ctx, point) {        
        ctx.beginPath();
        for (var i = 0; i < this.curves.length; i++) {            
            this.curves[i].draw(ctx, true);
            if(i==0)
                this.curves[i].draw(ctx);
            else this.curves[i].draw(ctx);            
        }        
        return ctx.isPointInPath(point.x,point.y);
    }

    this.draw = function (ctx) {
        ctx.beginPath();
        for (var i = 0; i < this.curves.length; i++) {
            this.curves[i].draw(ctx);
        }        
        ctx.stroke();
    }
}
function BezierCurve(startPoint, point1, point2, endPoint) {
    this.startPoint = startPoint;
    this.point1 = point1;
    this.point2 = point2;
    this.endPoint = endPoint;

    this.draw = function (ctx, doNotMove) {
        if(!doNotMove)
            ctx.moveTo(this.startPoint.x, this.startPoint.y);
        ctx.bezierCurveTo(this.point1.x, this.point1.y, this.point2.x, this.point2.y, this.endPoint.x, this.endPoint.y);
    }
}

function QuadraticCurve(startPoint, point1, endPoint) {
    this.startPoint = startPoint;
    this.point1 = point1;    
    this.endPoint = endPoint;

    this.draw = function (ctx, doNotMove) {
        if (!doNotMove)
            ctx.moveTo(this.startPoint.x, this.startPoint.y);
        ctx.quadraticCurveTo(this.point1.x, this.point1.y, this.endPoint.x, this.endPoint.y);
    }
}